<template>
	<view>
		<view class="contactusBanner">
			<image :src="contactus" mode="widthFix" ></image>
		</view>
		<view class="uni-list-cell uni-list-cell-last margin-top-20" hover-class="uni-list-cell-hover" @click="togglePopup()">
			<view class="cell-navigate">
				<view class="uni-list-data background-color-30d159">
					<label class="iconfont icon-icon1 icon-label-lin" />
				</view>
				<view class="uni-item-left">
					<view class="color-3A3A3A">微信公众号</view>
					<view class="intro-bot color-9A9A9A">扫码关注官网微信公众号</view>
				</view>
			</view>
			<view class="listRight">
				<text class="advanceicon iconfont icon-xiangyou"></text>
			</view>
		</view>
		<uni-popup type="center" mode="insert" :mask-click="true" @change="change" ref="popup">
			<view class="uni-center center-box">
				<image class="image" :src="wechat_qrcode" :data-path="wechat_qrcode" @longpress="saveImage" />
				<view class="uni-image-close" @click="cancel('image')">
					<uni-icons type="clear" color="#fff" size="30" />
				</view>
			</view>
		</uni-popup>
		<view class="uni-list-cell uni-list-cell-last margin-top-20" hover-class="uni-list-cell-hover" @tap="makePhoneCall">
			<view class="cell-navigate">
				<view class="uni-list-data background-color-FFAC05">
					<label class="iconfont icon-dianhua1 icon-label-lin" />
				</view>
				<view class="uni-item-left">
					<view class="color-3A3A3A">服务热线</view>
					<view class="intro-bot color-9A9A9A">{{tell}}</view>
				</view>
			</view>
			<view class="listRight">
				<text class="advanceicon iconfont icon-xiangyou"></text>
			</view>
		</view>
		<view class="uni-list-cell uni-list-cell-last margin-top-20" hover-class="uni-list-cell-hover" @click="openBrowser('www.jnpfsoft.com')">
			<view class="cell-navigate">
				<view class="uni-list-data background-color-3cbdff">
					<label class="iconfont icon-liulanqi-IE icon-label-lin" />
				</view>
				<view class="uni-item-left">
					<view class="color-3A3A3A">官方网站</view>
					<view class="intro-bot color-9A9A9A">www.jnpfsoft.com</view>
				</view>
			</view>
			<view class="listRight">
				<text class="advanceicon iconfont icon-xiangyou"></text>
			</view>
		</view>
		<view class="uni-list-cell uni-list-cell-last margin-top-20 " hover-class="uni-list-cell-hover" >
			<view class="server">
				<view class="servetime">服务时间</view>
				<view class="workday">
					<label class="color-3A3A3A font-size24">工作日：</label>
					<text class="color-9A9A9A font-size24">8:30-12:00 ，13:00-20:00</text>
				</view>
				<view class="workday">
					<label class="color-3A3A3A font-size24">节假日：</label>
					<text class="color-9A9A9A font-size24">9:30-12:00 ，13:30-17:30</text>
				</view>
			</view>
			
		</view>

		<view class="versions-special"><text>Copyright@2025 上海轶伦环境科技有限公司出品</text></view>
	</view>
</template>

<script>
	import config from '@/common/js/config.js'
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import uniIcons from '@/components/uni-icons/uni-icons.vue'
	export default {
		components: {
			uniPopup,
			uniIcons
		},
		data() {
			return {
				tell: '400-6868-969',
				version: config.Global.SoftVersion,
				contactus: config.Resources.banner.contactus,
				wechat_qrcode: config.Resources.common.wechat_qrcode,
				type: '',
			}
		},
		methods: {
			openBrowser(url) {
				// #ifdef APP-PLUS
				plus.runtime.openURL(url);
				// #endif
				// #ifdef H5
				window.open(url);
				// #endif
				// #ifdef MP
				uni.navigateTo({
					url: '../yinmaisoft/yinmaisoft'
				})
				// #endif
			},
			toOffweb: function(e) {

			},
			makePhoneCall() {
				uni.makePhoneCall({
					phoneNumber: this.tell,
				})
			},

			togglePopup() {
				this.$refs.popup.open()
			},
			cancel() {
				this.$refs.popup.close()
			},
			change(e) {
				// // console.log('是否打开:' + e.show)
			},
			weChatQrCode(type) {
				// console.log(type)
				this.type = type;
			},
			saveImage(e) {
				uni.getImageInfo({
					src: e.currentTarget.dataset.path,
					success: (res) => {
						uni.saveImageToPhotosAlbum({
							filePath: res.path,
							success: function() {
								helper.msg('保存成功', 'success');
							}
						});
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f0f2f6;
	}

	a {
		border: none;
		color: inherit;
		text-decoration: none;
	}

	.contactusBanner {
		width: 100%;
	}

	.uni-list-cell {
		width: 95%;
		background: white;
		/* border-bottom: 1px solid #DDD; */
		margin: 20rpx auto 0;
		border-radius: 20rpx;
		overflow: hidden;
		box-sizing: border-box;
		padding-right: 20rpx;
	}

	.listRight>.iconfont {
		font-weight: bolder;
		color: #5E6B81;
	}

	.cell-navigate {
		border-bottom: none;
	}

	.contactusBanner>image {
		width: 100%;
	}

	.intro-bot {
		font-size: 24rpx;
		color: #9A9A9A;
	}

	.cell-navigate::after {
		display: none;
		content: none;
	}

	.cell-navigate {
		margin-left: 28rpx;
	}
	.server{
		flex: 1;
		padding: 0 30upx 10upx;
		.servetime{
			line-height: 78upx;
			font-size: 36upx;
			color: #252B3A;
			font-weight:bold;
		}
		.workday {
			color: #3A3A3A;
			line-height: 60upx;
			font-size: 28upx;
		}
	}

	

	.uni-list-data>.iconfont {
		font-size: 66rpx;
	}

	

	.hint {
		text-align: center;
		margin-top: 20upx;
		color: #9A9A9A;
	}

	.uni-item-left {
		margin-left: 33upx !important;
	}

	.center-box {
		width: 500upx;
		height: 500upx;
	}

	.center-box .image {
		width: 100%;
		height: 100%;
	}

	.uni-image-close {
		margin-top: 20px;
		text-align: center;
	}
</style>
